<template>
  <div class="banner" ref="baseInfo">
    <div class="w banner-top clearfix">
      <div class="f-left banner-logo mt-50">
        <div class="logo-img mt">
          <img v-if="entinfo.logo" :src="entinfo.logo" alt="" />
          <img v-else class="defult_img" src="@/assets/images/defult_img.png" alt="" />
        </div>
      </div>
      <div class="f-left logo-text">
        <h2>{{ entinfo.name }}</h2>
        <!-- <div class="industry"> -->
        <!-- <span class="mr-10">母婴</span> -->
        <!-- <span class="mr-20">制造</span> -->
        <!-- </div> -->

        <a :href="entinfo.site" target="_blank" class="ent-address" v-if="entinfo.site">{{ entinfo.site }}</a>
        <div class="address">
          <i class="iconfont address_icon icon-biaoqian mr-8" style="color: #0da9b0"></i>
          <span>行业：{{ getTraditionalName(entinfo.industry) }}</span>
        </div>
        <div class="address">
          <i class="iconfont address_icon icon-dizhi mr-8"></i>
          <span>地址：{{ entinfo.address }}</span>
        </div>
        <div class="create">
          <i class="iconfont momey_icon icon-meiyuanqianbao mr-8"></i>
          <!-- （{{ entinfo.regCapCur ? "人民币" : "美元" }}） -->
          <span class="mr-50">注册资金：{{
            entinfo.registeredCapital
              ? `${entinfo.registeredCapital} 万元`
              : ""
          }}</span>
          <i class="iconfont data_cion icon-riqi1 mr-8"></i>

          <span>成立日期：{{ entinfo.incorporationDate }}</span>
        </div>
      </div>
      <!-- <div class="f-right mr-50 follow" @click="attentionEnt">
        <i v-if="ISguanzhu" class="iconfont icon-guanzhuon"></i>
        <i v-else class="iconfont icon-guanzhu"></i>
        {{ "关注(" + entinfo.likeCnt + ")" }}
      </div> -->
    </div>
  </div>
</template>

<script>
import { getClientUseCompanyInfo } from "@/apis/com/company";
// import { getDicts } from '@/apis/system';
import { getIsAttentionEnt } from "@/apis/EntBase";
export default {
  props: {
    category: {
      default: [],
      type: Array,
    },
  },

  data () {
    return {
      ISguanzhu: false,
      entinfo: {},
    };
  },
  mounted () {
    setTimeout(() => {
      // this.drawLine();
    }, 10);
    // this.getAttentionTotalByObjId();
    // this.getRouterData()
  },
  created () {
    this.entId = this.$route.query.id;
    this.init();
  },
  methods: {
    init () {
      this.$setLoading(true);
      Promise.all([this.getentBaseInfo()])
        .then(() => {
          this.$setLoading(false);
        })
        .catch(() => {
          this.$setLoading(false);
        });
    },

    //获取企业基本信息
    getentBaseInfo () {
      getClientUseCompanyInfo(this.entId)
        .then((res) => {
          console.log("企业基本信息");
          console.log(res);
          if (res.code == 200) {
            this.entinfo = res.data;
          }
        })
        .catch((error) => { });
    },

    // 关注企业
    attentionEnt () {
      this.ISguanzhu = !this.ISguanzhu;
      this.ISguanzhu ? this.entinfo.likeCnt++ : this.entinfo.likeCnt--;
      // if (this.ISguanzhu) {
      //   this.$message.warning("已关注");
      //   return;
      // }
      // this.$setLoading(true)
      // let params = {
      //   companyId: this.entId
      // }
      // getClientUseCompanyList(params)
      //   .then((res) => {
      //     this.$setLoading(false)
      //   })
    },
    // 获取是否关注了该企业
    getIsAttentionEnt () {
      getIsAttentionEnt(this.entId)
        .then((res) => {
          if (res.code == 200) {
            this.ISguanzhu = res.data;
          }
        })
        .catch((error) => { });
    },

    getTraditionalName (dictValue) {
      console.log("this.category", this.category);

      return this.category.find((item) => item.dictValue == dictValue)
        ?.dictLabel;
    },
  },
};
</script>
<style lang="less" scoped>
.banner {
  width: 100%;
  height: 360px;
  background-image: url(../image/banner.png);
  background-size: 100% 100%;
  display: flex;
  justify-content: center;

  .banner-top {
    width: 1200px;
    padding-top: 80px;

    .address_icon {
      color: #2a51bc;
    }

    .momey_icon {
      color: #e9284f;
    }

    .data_cion {
      color: #e9284f;
    }

    .banner-logo {
      margin: 0 30px 4px 0px;
      margin-top: 10px;
      width: 246px;
      height: 138px;
      background-color: #fff;
      box-shadow: 6px 6px 20px 0px rgba(24, 138, 241, 0.16);

      .logo-img {
        width: 246px;
        height: 134px;
        display: flex;
        justify-content: center;
        align-items: center;

        img {
          width: auto;
          max-height: 120px;
          max-width: 200px;
          object-fit: cover;
        }
      }
    }

    .logo-text {
      width: 64%;

      h2 {
        font-family: Microsoft YaHei;
        font-size: @font36;
        font-weight: 700;
        line-height: 47px;
        color: @text-color-303;
        padding-bottom: 12px;
      }

      .ent-address {
        margin-bottom: 10px;
        display: block;
      }

      .industry {
        span {
          text-align: center;
          font-size: @font14;
          margin-bottom: 15px;

          &:nth-child(1) {
            display: inline-block;
            width: 60px;
            height: 24px;
            background-color: #ffffff;
            border: solid 1px #0da9b0;
            border-radius: 12px;
            color: #0da9b0;
          }

          &:nth-child(2) {
            display: inline-block;
            width: 60px;
            height: 24px;
            background-color: #ffffff;
            border: solid 1px @color-188;
            border-radius: 12px;
            color: @color-188;
          }

          &:nth-child(3) {
            color: @color-188;
          }
        }
      }

      .address {
        margin-bottom: 12px;

        span {
          font-size: @font16;
          color: @text-color-909;
        }
      }

      .create {
        span {
          font-size: @font16;
          color: @text-color-909;
        }
      }
    }

    .follow {
      cursor: pointer;

      span {
        font-size: @font16;
        color: @text-color-909;
      }
    }
  }
}

.icon-guanzhuon {
  color: red;
}
</style>
